import React,{Component} from 'react';
import Header from '../../system/header/Header';
import Footer from '../../component/footer-mobile/FooterMobile';
import MechanismSource from './source/MechanismSource';
import MobileList from '../mobile/list/List';
import Lang from './Lang.json';
import content from './content';
import queryString from 'query-string';
const prefix = "mobile-mechanism-solution";
class Mechanism extends Component{
    render(){
        let PanelSource = content.map((value,index)=>{
           return(
               <MechanismSource imgSrc={value.img} listSource={value.list}/>
           )
        });
        let page = queryString.parse(this.props.location.search).page;
        return(
            <div className={prefix}>
                <Header imgUrl={require('../img/solution.jpg')} mobileImg={require('../../component/mobileBanner/banner2.jpg')}/>
                <MobileList listSource={Lang} panelSource={PanelSource} defaultIndex={page?page:0}/>
                <Footer/>
            </div>
        )
    }
}
export default Mechanism;